<template>
  <div :class="prefixCls"> 
    <Row>
      <Col :span="6">
        <Avatar src="https://wosperry.com/lsky/thumbnails/17aff72f75f8b66f8fbcb3ac9865b4dc.png" size="large" />
      </Col>
      <Col :span="18">
        <Card>
          <Description
            size="middle"
            title="个人信息"
            :bordered="false"
            :column="1"
            :data="userinfo"
            :schema="[
              { field:'userId', label:'ID' },
              { field:'realName', label:'姓名' },
              { field:'username', label:'账号' },
              { field:'mobile', label:'电话' },
            ]"
          />
      </Card>
      </Col>
    </Row>
  </div>
</template>

<script lang="ts" setup>   
import {  ref } from 'vue';   
import {Card,Row,Col,Avatar} from 'ant-design-vue';

import { GetUserInfoModel } from '/@/api/sys/model/userModel';
import { getUserInfo } from '/@/api/sys/user';
import { Description } from '/@/components/Description';
const prefixCls = "userinfo"; 
 
const userinfo = ref({} as GetUserInfoModel);
getUserInfo().then(res=>{
  userinfo.value = res;
})
  
</script> 
